<template>
  <!-- 我的反馈 -->
  <div class="container">
    <van-cell-group>
      <van-field v-model="message" type="textarea" placeholder="请输入内容" rows="8"/>
    </van-cell-group>
    <div class="upload">
      <van-uploader :after-read="onRead">
        <!-- <van-icon name="photograph"/> -->
        <img class="img" src="../../assets/img/upload-img.png" alt srcset>
      </van-uploader>
    </div>
    <div class="btn">
      <van-button type="danger" @click="onSaveFeeds">提交</van-button>
    </div>
  </div>
</template>
<script>
export default {
  data () {
    return {
      message: ''
    }
  },
  methods: {
    onRead (file, detail) {
      console.log(file)
      console.log(detail)
      this.upload(file.file)
    },
    upload (file) {
      this.$axios.post('/xbkj-dj/web/file/upload', {
        file
      }).then(res => {
        console.log(res)
      })
    },
    onSaveFeeds () {
      // 发布朋友圈
      const message = this.message
      if (message.length < 1) {
        this.$toast('内容不能为空')
        return
      }
      this.$axios
        .post('/xbkj-dj/web/user/feeds/saveFeeds', {
          content: message
        })
        .then(res => {
          console.log(res)
          if (res.code === 0) {
            this.$toast('发布成功！')
            this.$router.back()
          }
        })
    }
  }
}
</script>
<style lang="less" scoped>
.container {
  background-color: #fff;
}
.upload {
  padding: 20px;
  .img {
    display: block;
    height: 60px;
    width: auto;
  }
}
.btn {
  text-align: center;
  background-color: #fff;
  padding: 30px 0;
  border-top: 10px solid #eee;
  .van-button--normal {
    width: 60%;
    height: 40px;
    line-height: 40px;
    border-radius: 6px;
  }
}
</style>
